function DataTable(eleID, columnList, refreshDataFunc) {
	var self = this;
	self.eleID = eleID;
	self.columnList = columnList;
	self.callback = refreshDataFunc;
	self.dataList = [];
	self.cols = [];
	self.rows = [];
	self.pageLimit = { pageRow: 50, pageIndex: 0, totalRow: 0 };
	self.initDataTable();
}
DataTable.prototype = {
	initDataTable: function () {
		this.cols = [];
		var tableHTML = "", colsHTML = "", titleHTML = "";
		for (var i = 0; i < this.columnList.length; i++) {
			var colName = this.columnList[i].field, colComment = this.columnList[i].title, colWidth = this.columnList[i].width;
			this.cols.push(colName);
			if (colWidth) {
				colsHTML += "<col style='width:" + colWidth + "px;'/>";
			} else {
				colsHTML += "<col/>";
			}
			titleHTML += "<td><label class='titleLabel' colName='" + colName + "'>" + colComment + "</label></td>";
		}
		tableHTML = "<div style='height:38px;width:100%;background-color: #c2d9fc'>"
				  + "    <div style='height:38px;width:calc(100% - 6px);float:left;overflow:hidden;'>"
				  + "        <table class='dataTableTitle' cellspacing='0' cellpadding='0' style='float:left;table-layout:fixed;height:38px;width:100%;'>"
				  + "	         <colgroup>" + colsHTML + "</colgroup>"
				  + "            <tbody><tr style='height:38px;'>" + titleHTML + "</tr></tbody>"
				  + "        </table>"
				  + "    </div>"
				  + "    <div style='float:left;width:6px;height:38px;'></div>"
				  + "</div>"
				  + "<div class='dataTableBodyDiv' style='width:100%;overflow-x:auto;overflow-y:scroll;height:calc(100% - 88px);'>"
				  + "    <table class='dataTableBody' cellspacing='0' cellpadding='0' style='float:left;table-layout:fixed;width:100%;'>"
				  + "	     <colgroup>" + colsHTML + "</colgroup>"
				  + "        <tbody></tbody>"
				  + "    </table>"
				  + "    <div class='emptyDataTable' style='width:100%;height:100%;display:none;text-align:center;display: flex;justify-content: center;align-items: center;'>暂无数据</div>"
				  + "</div>"
				  + "<div class='tablePageArea'>"
				  + "    <span style='float:left;'>显示第&nbsp;</span>"
				  + "    <span class='pageStartNum'>0</span>"
				  + "    <span>&nbsp;到第&nbsp;</span>"
				  + "    <span class='pageStopNum'>0</span>"
				  + "    <span>&nbsp;条记录&nbsp;&nbsp;总共&nbsp;</span>"
				  + "    <span class='totalTableNum'>0</span>"
				  + "    <span>&nbsp;条记录&nbsp;&nbsp;每页显示</span>"
				  + "    <span style='width:60px;height:24px;'>"
				  + "        <select class='pageLimitOption' style='height:24px;width:60px;color:#197BFD;'>"
				  + "            <option>20</option><option selected='selected'>50</option><option>100</option>"
				  + "        </select>"
				  + "    </span>"
				  + "    <span>条记录</span>"
				  + "    <label class='tablePageItem pageItemRight' style='border-radius:0 5px 5px 0;cursor:not-allowed;'>&gt;&gt;</label>"
				  + "    <span class='tablePageItemList' style='float:right;'><label class='tablePageItem tablePageSelectItem'>1</label></span>"
				  + "    <label class='tablePageItem pageItemLeft' style='border-radius:5px 0 0 5px;border-left:1px solid #197BFD;cursor:not-allowed;'>&lt;&lt;</label>"
				  + "</div>";
		$('#' + this.eleID).html(tableHTML);
		this.refreshTableElement();
		this.bindPageAreaEvent();
	},
	refreshTableElement: function () {
		var parHeight = $('#' + this.eleID).height();
		$('#' + this.eleID).find('.dataTableBodyDiv').height(parHeight - 88);
	},
	setTableData: function (tableData) {
		this.dataList = tableData.dataList;
		this.pageLimit = tableData.pageLimit;
		var pageRow = this.pageLimit.pageRow || 50;
		var totalRow = this.pageLimit.totalRow || 0;
		var pageIndex = this.pageLimit.pageIndex || 0;
		$('#' + this.eleID).find('.totalTableNum').text(this.pageLimit.totalRow || 0);
		$('#' + this.eleID).find('.pageStartNum').text(totalRow == 0 ? 0 : (pageIndex * pageRow + 1));
		var stopRow = (pageIndex + 1) * pageRow;
		if (totalRow < stopRow) stopRow = totalRow;
		$('#' + this.eleID).find('.pageStopNum').text(stopRow);
		var totalPage = Math.ceil(totalRow / pageRow);
		var startPage = 1, stopPage = totalPage;
		if (totalPage > 5) {
			if (pageIndex < 2) {
				stopPage = 5;
			} else {
				stopPage = pageIndex + 3 < totalPage ? (pageIndex + 3) : totalPage;
			}
			if (totalPage - pageIndex < 3) {
				startPage = totalPage - 4;
			} else {
				startPage = pageIndex - 1 > 0 ? (pageIndex - 1) : 1;
			}
		}
		var pageHTML = "";
		// console.log(startPage, 'startPage');
		if (this.dataList.length == 0) {
			pageHTML = "<label class='tablePageItem'>" + 1 + "</label>";
		} else {
			for (var i = startPage; i <= stopPage; i++) {
				pageHTML = "<label class='tablePageItem " + (pageIndex + 1 == i ? "tablePageSelectItem" : "") + "'>" + i + "</label>" + pageHTML;
			}
		}

		$('#' + this.eleID).find('.tablePageItemList').html(pageHTML);
		if ($('#' + this.eleID).find('.tablePageSelectItem').prev().length > 0) {
			$('#' + this.eleID).find('.pageItemRight').css('cursor', 'pointer');
		} else {
			$('#' + this.eleID).find('.pageItemRight').css('cursor', 'not-allowed');
		}
		if ($('#' + this.eleID).find('.tablePageSelectItem').next().length > 0) {
			$('#' + this.eleID).find('.pageItemLeft').css('cursor', 'pointer');
		} else {
			$('#' + this.eleID).find('.pageItemLeft').css('cursor', 'not-allowed');
		}
		$('#' + this.eleID).find('.dataTableBody>tbody').empty();
		this.rows = [];
		if (this.dataList.length == 0) {
			$('#' + this.eleID).find('.dataTableBody').hide();
			$('#' + this.eleID).find('.emptyDataTable').show();
		} else {
			$('#' + this.eleID).find('.dataTableBody').show();
			$('#' + this.eleID).find('.emptyDataTable').hide();
			for (var i = 0; i < this.dataList.length; i++) {
				var thisData = this.dataList[i];
				var rowHTML = "", rowData = [];
				for (var j = 0; j < this.columnList.length; j++) {
					var thisCols = this.columnList[j];
					var thisColName = thisCols && thisCols.field ? thisCols.field : "";
					var thisColAlign = thisCols && thisCols.align ? thisCols.align : "left";
					var thisCellText = thisData[thisColName] == '0' ? "0" : (thisData[thisColName] || "");
					rowHTML += "<td class='dataCell' colCode='" + thisColName + "' style='text-align:" + thisColAlign + "'>" + thisCellText + "</td>";
					rowData.push(thisData[thisColName]);
				}
				rowHTML = "<tr>" + rowHTML + "</tr>";
				$('#' + this.eleID).find('.dataTableBody>tbody').append(rowHTML);
				this.rows.push(rowData);
			}
		}
		this.bindPageAreaEvent();
	},
	bindPageAreaEvent: function () {
		var self = this;
		$('#' + this.eleID).find('.pageLimitOption').unbind();
		$('#' + this.eleID).find('.pageLimitOption').change(function () {
			self.pageLimit['pageRow'] = parseInt($(this).val());
			self.callback();
		});
		$('#' + this.eleID).find('.tablePageItem').unbind();
		$('#' + this.eleID).find('.tablePageItem').click(function () {
			if ($(this).hasClass('tablePageSelectItem') || $(this).css('cursor') == 'not-allowed') return;
			if ($(this).hasClass('pageItemRight')) {
				self.pageLimit['pageIndex'] = self.pageLimit['pageIndex'] + 1;
			} else if ($(this).hasClass('pageItemLeft')) {
				self.pageLimit['pageIndex'] = self.pageLimit['pageIndex'] - 1;
			} else {
				self.pageLimit['pageIndex'] = parseInt($(this).text()) - 1;
			}
			self.callback();
		});
		$('#' + self.eleID).find('.dataTableBody').find('.dataCell').click(function () {
			$('#' + self.eleID).find('.dataTableBody').find('.selectTableRow').removeClass('selectTableRow');
			$(this).parent().addClass('selectTableRow');
		});
		$('#' + self.eleID).find('.dataTableBodyDiv').scroll(function () {
			$('#' + self.eleID).find('.dataTableTitle').parent()[0].scrollLeft = $(this).scrollLeft();
		});
	},
	getPageLimit: function () {
		return this.pageLimit;
	},
	getRowCount: function () {
		return this.dataList.length;
	},
	getRowData: function (row) {
		if (row >= this.dataList.length) return alert("超出表格最大行");
		return this.dataList[row];
	},
	getRowList: function (row) {
		if (row >= this.rows.length) return alert("超出表格最大行");
		return this.rows[row];
	},
	getCellData: function (row, col) {
		if (typeof col === 'number') {
			return $('#' + this.eleID).find('.dataTableBody>tbody>tr:eq(' + row + ')>td:eq(' + col + ')').text().trim();
		} else {
			return this.dataList[row][col];
		}
	},
	setData: function (row, col, value) {
		var thisRowData = this.dataList[row];
		if (!thisRowData) return;
		this.rows[row][col] = value;
		if (typeof col === 'number') {
			var editEle = $('#' + this.eleID).find('.dataTableBody>tbody>tr:eq(' + row + ')>td:eq(' + col + ')');
			var thisColName = editEle.attr('colCode');
			thisRowData[thisColName] = value;
			editEle.text(value);
			this.dataList[row] = thisRowData;
		} else {
			$('#' + this.eleID).find('.dataTableBody>tbody>tr:eq(' + row + ')>td[colcode="' + col + '"]').text(value);
			thisRowData[col] = value;
			this.dataList[row] = thisRowData;
		}
	},
	setCurrentRow: function (row) {
		$('#' + this.eleID).find('.dataTableBody').find('.selectTableRow').removeClass('selectTableRow');
		$('#' + this.eleID).find('.dataTableBody>tbody>tr:eq(' + row + ')').addClass('selectTableRow');
	},
	getCurrentRow: function () {
		var currIndex = $('#' + this.eleID).find('.dataTableBody').find('.selectTableRow').index();
		return currIndex;
	},
	deleteRow: function (row) {
		var tableRow = [], tableRowMap = [];
		for (var i = 0; i < this.rows.length; i++) {
			if (i == row) continue;
			tableRow.push(this.rows[i]);
			tableRowMap.push(this.dataList[i]);
		}
		this.rows = tableRow;
		this.dataList = tableRowMap;
		$('#' + this.eleID).find('.dataTableBody>tbody>tr:eq(' + row + ')').remove();
	},
	deleteAllRow: function () {
		this.rows = [];
		this.dataList = [];
		$('#' + this.eleID).find('.dataTableBody>tbody').empty();
	},
	resize: function () {
		this.refreshTableElement();
	}
}